<template>
	<!-- 页面内容 -->
	<view class="baseForm">
		<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
		<!-- 条码录入 -->
		<view class="upload-scan">
			<scan-bar id="scanInput" ref="scanBarRef" placeholder="扫描送货单条码" @code-scanned="getDeliveryInfoByCode"
				:key="datekey"></scan-bar>
		</view>
		<u--form labelPosition="left" :model="umodel" ref="uForm" class="form" labelWidth="200rpx"
			errorType="toast">
			<u-line class="first-line"></u-line>
			<u-form-item label="送货单编号" prop="asnCode" class="disabled">
				<u--input v-model="umodel.asnCode" disabled inputAlign="right" border="none"
					placeholder="请输入送货单编号"></u--input>
			</u-form-item>
			<u-form-item label="供应商编码" class="disabled">
				<u--input v-model="umodel.partnerCode" disabled inputAlign="right" border="none"
					placeholder="请输入供应商编码"></u--input>
			</u-form-item>
			<u-form-item label="供应商名称" prop="partnerName" class="disabled">
				<u--input v-model="umodel.partnerName" disabled inputAlign="right" border="none"
					placeholder="请输入供应商名称"></u--input>
			</u-form-item>
			<u-form-item label="存储地点" prop="storageLocationId" @click="openStorageLocationSelect">
				<u--input v-model="umodel.storageLocationName" border="none" disabled disabledColor="#ffffff" inputAlign="right" placeholder="请选择存储地点"></u--input>
				<template #right>
					<u-icon name="arrow-right"></u-icon>
				</template>
			</u-form-item>
			<u-line></u-line>
			<!-- 标准picker -->
			<u-picker :show="showPick" :columns="storageLocationPickActions" keyName="storageLocationName" immediateChange @cancel="showPick = false" @confirm="storageLocationSelect"></u-picker>
		</u--form>
		<!-- 提交按钮 -->

		<view class="search">
			<u-button type="primary" @click="receiveData" class="custom-style" :loading="posting">开始收货</u-button>
		</view>
		
	</view>
</template>

<script lang="ts" setup>
	import { reactive, ref } from 'vue';
	import { useWmsStore } from '@/stores/useWmsStore';
	import { onShow } from '@dcloudio/uni-app';
	import ScanBar from '@/components/scan-bar/index.vue';
	import { http } from "../../../utils/http";
	import ULine from "../../../uni_modules/uview-plus/components/u-line/u-line.vue";
	// 表单数据定义
	const umodel = reactive({
		asnCode: '',
		shipmentStatus: '',
		partnerId: '',
		partnerCode: '',
		partnerName: '',
		storageLocationId: '',
		storageLocationCode: '',
		storageLocationName: '',
	});
	
	const receiveDataBack = {
		asnDTO: {},
		asnMaterialDetailList: [],
		asnPackingDetailList: [],
	};

	// 重置表单信息 & 光标自动blur
	const scanBarRef = ref();
	const datekey = ref(new Date());
	const showPick = ref(false);
	
	// 存储地点picker选择
	const storageLocationPickActions = reactive([]);
	
	onShow(async () => {
		reset();
		getStorageLocations()
	})
	
	function reset() {
		umodel.asnCode = '';
		umodel.shipmentStatus = '';
		umodel.partnerId = '';
		umodel.partnerCode = '';
		umodel.partnerName = '';
		umodel.storageLocationId = '';
		umodel.storageLocationCode = '';
		umodel.storageLocationName = '';
		receiveDataBack.asnDTO = {};
		receiveDataBack.asnMaterialDetailList = [];
		receiveDataBack.asnPackingDetailList = [];
	}
	
	async function getStorageLocations() {
		const data = await http({
			url: '/wms/storagelocation/getListByUser/',
			method: 'GET',
			data: {}
		});
		console.log(data);
		storageLocationPickActions[0] = data.data
	}
	
	function storageLocationSelect(e) {
		if (e.value.length) {
			umodel.storageLocationId = e.value[0].id;
			umodel.storageLocationCode = e.value[0].storageLocationCode;
			umodel.storageLocationName = e.value[0].storageLocationName;
		}
		showPick.value = false;
	}
	function openStorageLocationSelect() {
		showPick.value = true;
		uni.hideKeyboard();
	}

	async function getDeliveryInfoByCode(result : any) {
		const data = await http({
			url: '/wms/rmreceipt/getdelivery/srm/' + result,
			method: 'GET',
			data: {}
		});
		scanBarRef.value.reset();
		var info = {
			asnCode: data.data.asnDTO.asnCode,
			shipmentStatus: data.data.asnDTO.shipmentStatus,
			partnerId: data.data.asnDTO.partnerId,
			partnerCode: data.data.asnDTO.partnerCode,
			partnerName: data.data.asnDTO.partnerName
		}
		Object.assign(umodel, info);
		Object.assign(receiveDataBack, data.data); 
		console.log(umodel.shipmentStatus);
	}

	// 校验提交
	const uForm = ref();
	const posting = ref(false);

	function receiveData() {
		if (!umodel.asnCode
				|| !umodel.partnerId
				|| !umodel.partnerCode
				|| !umodel.partnerName) {
			uni.$u.toast('请先扫描送货单！');
		} else {
			if (!umodel.storageLocationId) {
				uni.$u.toast('请选择存储地点！');
				return;
			}
			else{
				if (umodel.shipmentStatus === '4') {
					uni.$u.toast('收货已完成,不可再次收货');
					return;
				}
			receiveDataBack.asnDTO.storageLocationId = umodel.storageLocationId;
			receiveDataBack.asnDTO.storageLocationCode = umodel.storageLocationCode;
			receiveDataBack.asnDTO.storageLocationName = umodel.storageLocationName;
			// 设置、更新加工单信息
			useWmsStore().setReceiveInfo(receiveDataBack);
			console.log(receiveDataBack)
			uni.navigateTo({
				url: '/pages/use/receive/list',
			});
			}
		}
	}
</script>

<style lang="scss">
	.baseForm {
		.form {
			padding: $uni-page-padding;
		}

		.upload-scan {
			padding: 10px 40rpx 0 40rpx;
		}

		.call-title {
			padding: $uni-page-padding;

			.title {
				font-size: 14px;
				color: #8f9ca2;
				display: flex;
				flex-direction: row;
			}
		}

		.u-form {
			.scan-bar {
				display: flex;
				flex: 1;
			}

			.u-line {
				padding: 0 0 10px 0;
			}
		}

		.search {
			display: flex;

			.custom-style {
				// width: 120px;
				margin: 10px 5px 5px;
				height: 36px;
				border-radius: 8px;

				&:nth-child(1) {
					flex: 1
				}

				&:nth-child(2) {
					flex: 3
				}
			}
		}

		.list {
			.list-title {
				line-height: 40px;
				font-size: 14px;
				color: rgba(0, 0, 0, 0.4);
			}

			.card {
				margin-top: 5px;
				margin-bottom: 10px;
				border-radius: 7px;
				display: flex;
				align-items: center;
				padding: 10px 0;
				transition: all 300ms ease;
				box-shadow: 0 0 1px rgba(0, 0, 0, 0.1);

				.left {
					// flex-basis: 90rpx;
					padding-right: 10px;
					text-align: right;
					font-size: 13px;

					.enter {
						line-height: 20px;
						margin-bottom: 5px;
					}

					.number {
						font-size: 13px;
						line-height: 18px;
					}

					:deep(.u-icon--right) {
						flex-direction: row-reverse;
					}
				}

				.right {
					flex: 1;
					padding-left: 15px;

					.title {
						font-size: 15px;
						line-height: 20px;
						margin-bottom: 5px;
					}

					.body {
						color: rgba(0, 0, 0, 0.4);
						font-size: 13px;
						line-height: 18px;
					}
				}
			}
		}

		.submit_btn {
			margin: 0 0 10px 0;
		}
	}
</style>